<template>
  <div class="dingding-wrap">
    <div>{{ msg }}</div>
  </div>
</template>

<script>
import { ding } from 'api'
import { getStore, setStore, removeStore } from 'utils/util.js'
import { mapMutations } from 'vuex'

export default {
  data: function () {
    return {
      msg: '钉钉账号绑定中，请稍候......'
    }
  },
  mounted() {
    // 登录方式 1账号密码(未绑定钉钉) 2钉钉扫码
    let loginType = getStore('loginType')
    if (loginType == 1) {
      this.bindUser()
    } else {
      this.ddLogin()
    }
  },
  methods: {
    // 绑定钉钉
    async bindUser() {
      this.msg = '钉钉账号绑定中，请稍候......'

      let userInfo = getStore('userLoginInfo')

      let ddInfo = Object.fromEntries(
        new URLSearchParams(window.location.href.split('?')[1])
      )
      let res = await ding.bindDD(
        {
          random_code: ddInfo.random_code,
          system_code: ddInfo.system_code,
          phone: ddInfo.phone,
          ding_user_id: ddInfo.dingUserId,
          timestamp: ddInfo.timestamp,
          ding_talk_sign: ddInfo.sign,
          company_code: ddInfo.companyCode
        },
        userInfo.staff_token
      )

      if (res.code && res.state === 1) {
        this.initUser()
      } else if (res.code) {
        this.msg = res.msg
        setTimeout(() => {
          this.reloadPage()
        }, 1500)
      } else {
        this.$message.error(res.msg)
        setTimeout(() => {
          this.reloadPage()
        }, 1500)
      }
    },

    // 钉钉登录
    async ddLogin() {
      this.msg = '扫码登录成功，页面即将跳转......'

      let ddInfo = Object.fromEntries(
        new URLSearchParams(window.location.href.split('?')[1])
      )

      let res = await ding.ddLogin({
        random_code: ddInfo.random_code,
        system_code: ddInfo.system_code,
        phone: ddInfo.phone,
        ding_user_id: ddInfo.dingUserId,
        timestamp: ddInfo.timestamp,
        ding_talk_sign: ddInfo.sign,
        type: 2
      })
      if (
        res.code == '20001' ||
        res.code == '20002' ||
        res.code == '20003' ||
        res.code == '20004' ||
        res.code == '20005'
      ) {
        this.msg = '您的账号已在其地方登录或登录状态已失效，请重新登陆'
      } else if (res.code && res.state === 1) {
        this.initUser(res.data)
      } else {
        this.msg = res.msg || '未知错误'
        // this.$message.error(res.msg);
        setTimeout(() => {
          this.reloadPage()
        }, 1500)
      }
    },

    initUser(res) {
      let userInfo = res || getStore('userLoginInfo')

      setStore('succLogin', true)

      setStore('token', userInfo.staff_token)

      setStore('userInfo', {
        username: userInfo.staff_name,
        staff_id: userInfo.staff_id
      })

      setStore('userInfo', {
        username: userInfo.staff_name,
        staff_id: userInfo.staff_id
      })

      setStore('rolesArr', userInfo.permission)

      this.setInfo({ username: userInfo.staff_name })

      this.reloadPage()
    },
    // 刷新页面
    reloadPage() {
      removeStore('userLoginInfo')
      setTimeout(() => {
        window.top.location.reload()
      }, 1000)
    },
    ...mapMutations({
      setInfo: 'setInfo',
      setRoles: 'setRoles',
      setToken: 'setToken',
      setPowers: 'setPowers'
    })
  }
}
</script>

<style lang="less" scoped>
.dingding-wrap {
  position: absolute;
  z-index: 10000;
  width: 100%;
  background-color: #ffffff !important;
  div {
    position: relative;
    left: 85px !important;
    width: 200px;
    text-align: center;
  }
}
</style>
